<template>
	<view class="uni-pages">
		<z-paging ref="paging" v-model="dataList" @query="queryList">
			
			<view class="cu-list menu-avatar">
			    <!-- 瓦洛兰之盾-塔里克 -->
			    <view class="cu-item margin-top-sm" v-for="(item,index) in dataList">
			        <view class="cu-avatar round md" style="background-image:url(https://ossweb-img.qq.com/images/lol/img/champion/Taric.png);">
			            <view class="cu-tag badge">99+</view>
			        </view>
			        <view class="content ">
			            <view class="text-333 font-16">
			                <view class="text-cut  font-weight-blod">瓦洛兰之盾-塔里克</view>
			            </view>
			            <view class="text-82 font-14 flex flex-1">
			                <view class="text-cut">
			                    塔里克是保护者星灵，用超乎寻常的力量守护着符文之地的生命、仁爱以及万物之美。塔里克由于渎职而被放逐，离开了祖国德玛西亚，前去攀登巨神峰寻找救赎，但他找到的却是来自星界的更高层的召唤。现在的塔里克与古代巨神族的神力相融合，以瓦洛兰之盾的身份，永不疲倦地警惕着阴险狡诈的虚空腐化之力。
			                </view>
			            </view>
			        </view>
			    </view>
			</view>
		</z-paging>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				dataList: []

			}
		},
		onLoad() {

		},
		onShow() {

		},
		methods: {

			// @query所绑定的方法不要自己调用！！需要刷新列表数据时，只需要调用this.$refs.paging.reload()即可
			async queryList(pageNo, pageSize) {
				console.log(pageNo, pageSize)
				console.log("判断是否登录", this.isLogin)
				if (pageNo == 1) {
					let res = [{
						id: 1
					}, {
						id: 1
					}, {
						id: 1
					}, {
						id: 1
					}, {
						id: 1
					}]
					this.$refs.paging.complete(res)

				} else {
					this.$refs.paging.complete([])
				}
				// if (!this.isLogin) {
				// 	this.$refs.paging.complete(false);
				// 	return;
				// }
				// try {
				// 	let data = await this.$http.post(this.$api.edu.getOnlineCourseSelectionList, {
				// 		key: this.dataForm.key,
				// 		studyId: this.dataForm.studyId ? this.dataForm.studyId : -1,
				// 	})
				// 	this.$refs.paging.complete(data.list)
				// } catch (e) {
				// 	this.$refs.paging.complete([]);
				// }

			},


		}
	}
</script>

<style scoped lang="scss">
	.uni-pages {
		height: 100vh;
		background-color: #F6F6F6;
	}

	.cu-list.menu-avatar>.cu-item .content {
		position: absolute;
		left: 130upx;
		width: calc(100% - 80upx - 60upx - 20upx);
		line-height: 1.6em;
	}
	
	.cu-list.menu-avatar>.cu-item .flex .text-cut {
	    max-width: 100%;
	}
</style>